<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
			#box1{
				width: 800px;
				height: 700px;
				margin-bottom: 10px;
				text-align: center;
				margin-left: 0px;
				margin: 0 auto;
			}
    		h2{
    			text-align: center;
    		}
    		table{
				font-family:vrinda;
				border: 1px;
				text-align: center;
    			color:#A10000;  
    			border-width: 1px;  
    			border-color: #666666;  
    			border-collapse: collapse;  
			}
			tr{
				border-width: 1px;  
    			padding: 8px;  
    			border-style: solid;  
    			border-color: #666666;  
			}
			td{
				border-width: 1px;  
    			padding: 8px;  
    			border-style: solid;  
    			border-color: #666666;    
			}
			.inp{margin-top: 50px;}
			.se{
				position: relative;
				left: -35px;
			}
			.search{
				position: relative;
				top: -46px;
				left: 299px;
			}
			.searchb img{
				margin-right: -148px;
				position: relative;
				top: -20px;
			}
			.look{
				float: right;
				width: 173px;
				height: 240px;
				position: absolute;
				background: write;
				top: 54px;
				right: -178px;
			}
			.look a{
				text-align: center;
				
			}
			.ageTitle{cursor: pointer;}
			.ageTitle:hover{background: yellow;}
    </style>
</head>
<body>
	<div id="box1">
		<div class="search">
		<div class="searcha">
		<input type="text" placeholder="请输入要搜索的内容" class="se" ng-model="txt"/>
		</div>
		<div href="javascript:;" class="searchb" ng-click="search()">
			<img src="img/search.png"/>
		</div>
		<ul class="look">
		</ul>
		</div>	
    <table align="center" border="1">
    	<tr>
    		<th width="200px">编号</th>
    		<th width="200px">姓名</th>
    		<th width="200px" class="ageTitle" ng-click="sortQuery()">年龄</th>
    		<th width="200px">性别</th>
    		<th width="200px">操作</th>
    	</tr>
    	<tr ng-repeat="user in list">
    		<td>{{$index+1}}</td>
    		<td><a ng-href="#/view/{{$index}}">{{user.username}}</a></td>
    		<td>{{user.userage}}</td>
    		<td>{{user.usersex}}</td>
    		<td>
    			<input type="checkbox" ng-checked="checks" value="{{user._id}}">
    			<a href="javascript:;" ng-click="del(user._id)">删除</a>
				<a href="javascript:;" ng-click="update(user._id,$index)">修改</a>
    		</td>
    	</tr>
    	<tr align="center">
    		<td><a href="javascript:;" ng-click="replace(1)">首页</a></td>
    		<td><a href="javascript:;" ng-click="replace(page-1)">上一页</a></td>
    		<td>当前：第{{page}}页,共计：{{total}}页</td>
    		<td><a href="javascript:;" ng-click="replace(page+1)">下一页</a></td>
    		<td><a href="javascript:;" ng-click="replace(total)">尾页</a></td>
    	</tr>
    </table>
    	<!--全选-->
    	<input type="checkbox" ng-click="checkAll()" na-checked="checks"/>
    	<button ng-click="delAll()">删除</button>
    <div class="inp" align="center">
		姓名：<input type="text" ng-model="name"/><br>
			<h1></h1>
		年龄：<input type="number" ng-model="age"/><br>
			<h1></h1>
		性别：<input type="radio" ng-model="sex" name="sex" ng-checked=true value="男">男 
			<input type="radio" checked ng-model="sex" name="sex" value="女">女		
			<input type="hidden" ng-model="id">
		<!--不写value="男"--，radio的值是TRUE或FALSE-->
			<button ng-click="save()">保存</button>	
	</div>
  </div>
</body>
</html>